{{define "page"}}
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <script type="text/javascript">
    var csrfToken = {{csrfToken}};
  </script>
  {{if googleAnalytics}}
  <!-- Global site tag (gtag.js) - Google Analytics -->
  <script async src="https://www.googletagmanager.com/gtag/js?id={{googleAnalytics}}"></script>
  <script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());

    gtag('config', {{googleAnalytics}});
  </script>
  {{else}}
  <!-- Use noop gtag function if analytics are not enabled. -->
  <script>
    function gtag() {}
  </script>
  {{end}}
  {{if .MobileFriendly}}
    <meta name="viewport" content="width=device-width, initial-scale=1">
  {{end}}
  <title>{{block "title" .Arguments}}Prow{{ end }}</title>
  <link rel="stylesheet" type="text/css" href="/static/style.css?v={{deckVersion}}">
  <link rel="stylesheet" type="text/css" href="/static/extensions/style.css?v={{deckVersion}}">
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:400,700">
  <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
  <link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.indigo-pink.min.css">
  <script type="text/javascript" src="/static/extensions/script.js?v={{deckVersion}}"></script>
  <script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script>
  {{block "scripts" .Arguments}}{{end}}
</head>
{{ $defaultLogo := "/static/logo-light.png" }}
{{- if .DarkMode -}}
{{- $defaultLogo = "/static/logo-dark.png" -}}
{{- end -}}
<body id="{{.PageName}}"{{if branding.BackgroundColor}} style="background-color: {{branding.BackgroundColor}};"{{end}}>
<div id="alert-container"></div>
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
  <header class="mdl-layout__header"{{if branding.HeaderColor}} style="background-color: {{branding.HeaderColor}};"{{end}}>
    <div id="header-title" class="mdl-layout__header-row">
      <a href="/"
         class="logo"><img src="{{or branding.Logo $defaultLogo}}?v={{deckVersion}}" alt="kubernetes logo" class="logo"/></a>
      <span class="mdl-layout-title header-title">{{block "pageTitle" .Arguments}}{{template "title" .}}{{end}}</span>
    </div>
  </header>
  <div class="mdl-layout__drawer">
    <span class="mdl-layout-title">Prow Dashboard</span>
    <nav class="mdl-navigation">
      <a class="mdl-navigation__link{{if eq .PageName "index"}} mdl-navigation__link--current{{end}}" href="/">Prow Status</a>
      {{ if sections.PR }}
        <a class="mdl-navigation__link{{if eq .PageName "pr"}} mdl-navigation__link--current{{end}}" href="/pr">PR Status</a>
      {{ end }}
      <a class="mdl-navigation__link{{if eq .PageName "command-help"}} mdl-navigation__link--current{{end}}" href="/command-help">Command Help</a>
      {{ if sections.Tide }}
        <a class="mdl-navigation__link{{if eq .PageName "tide"}} mdl-navigation__link--current{{end}}" href="/tide">Tide Status</a>
        <a class="mdl-navigation__link{{if eq .PageName "tide-history"}} mdl-navigation__link--current{{end}}" href="/tide-history">Tide History</a>
      {{ end }}
      <a class="mdl-navigation__link{{if eq .PageName "plugins"}} mdl-navigation__link--current{{end}}" href="/plugins">Plugins</a>
      <a class="mdl-navigation__link" href="https://docs.prow.k8s.io/docs/" target="_blank">Documentation <span class="material-icons">open_in_new</span></a>
    </nav>
    <footer>
      {{deckVersion}}
    </footer>
  </div>
  <div id="loading-progress" class="mdl-progress mdl-js-progress mdl-progress__indeterminate hidden"></div>
  <main class="mdl-layout__content">
    {{block "content" .Arguments}}{{end}}
  </main>
</div>
{{block "extra content" .Arguments}}{{end}}
<div id="toast" class="mdl-js-snackbar mdl-snackbar">
  <div class="mdl-snackbar__text"></div>
  <button class="mdl-snackbar__action" type="button"></button>
</div>
<div id="toastAlert" class="mdl-js-snackbar mdl-snackbar">
  <div class="mdl-snackbar__text"></div>
  <button class="mdl-snackbar__action" type="button"></button>
</div>
</body>
</html>
{{end}}
